/**
 * 有时候,你会比TS更加明确一个值的类型,此时,可以使用类型断言来指定更具体的类型
 * <a href='xxx.com' id='link'></a>
 * const link = document.getElementById('link')
 * getElementById方法返回值的类型是HTMLElement,该类型只包含所有标签公共的属性和方法,不包含a标签特有的href等属性
 * 
 * 因此,这个类型太宽泛,无法操作href等a标签特有的属性或方法
 * 解决方式: 这种情况下就需要使用 类型断言 指定更加具体的类型
 */


// const link = document.getElementById('link')

// link.href  // 不存在属性href

/**
 * 1.使用 as 关键字实现类型断言
 * 2.关键字as后面的类型是一个更加具体的类型(HTMLElement是HTMLElement的子类型)
 * 3.通过类型断言,link的类型变得更加具体,这样就可以访问a标签特有的属性或方法了
 * 
 * 技巧:
 *      console.dir()打印dom元素,在属性列表的最后面,可以看到该元素的类型
 */

// 1.
const link = document.getElementById('link') as HTMLAnchorElement
// link.href //可以访问

// 2.不常用
const alink = <HTMLAnchorElement>document.getElementById('link')



